<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>团队报表管理</title>
<%@include file="/WEB-INF/base.jspf"%>
<style type="text/css">
.body_wrapper {
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	padding: 0px 20px;
}

.wrapper_buttons {
	position: relative;
}
	.modal-dialog {
		max-width: 1000px;
	}
.shezhileiContent {
	width: 160px;
	height: 150px;
	border: 1px solid #9c8f8f;
	border-radius: 5px;
	box-sizing: border-box;
	padding: 13px;
	position: absolute;
	right: 0px;
	top: 36px;
	z-index: 999;
	background: #fff;
}

.shezhileiContent li {
	margin-bottom: 10px;
}

.shezhileiContent li span {
	margin-left: 6px;
}

.wrapper_buttons input {
	height: 32px;
	width: 174px;
	margin-left: 10px;
}

.wrapper_buttons button {
	margin-left: 10px;
}

#table_id_example_paginate {
	margin-right: 100px;
}

.class-input-pageNumber {
	width: 40px;
	height: 23px;
	position: absolute;
	right: 65px;
	top: 12px;
}

.class-span-searchBtn {
	height: 24px;
	width: 36px;
	font-size: 14px;
	text-algin: center;
	line-height: 25px;
	padding: 0 !important;
	position: absolute;
	right: 29px;
	top: 12px;
}

.dataTables_length {
	margin-top: 12px;
	margin-left: 50px;
}

.tableSearch {
	position: relative;
}

table th,table tr,table td {
text-align: center;
vertical-align:middle;
}
</style>
</head>
<body>
	<div class="body_wrapper">
		<div class="wrapper_buttons" style="display: flex; margin-top: 20px;">
			<input type="text" name="" id="date1" placeholder="开始时间" /> <input
				type="text" name="" id="obj-name" value=""
				class="form-control" placeholder="单用户查询" />
			<button type="button" class="layui-btn layui-btn-radius"
				id="btn-searchTable">查询</button>
			<button type="button" class="layui-btn layui-btn-radius"
				id="btn-resetTable">重置</button>
			<br />
		</div>
		<div class="wrapper_buttons"
			style="display: flex; margin-bottom: 20px;">
			<input type="text" name="" id="date2" placeholder="结束时间" />
		</div>
		<table id="table_id_example"
			class="class-tableDataTable class-table-needClick display table table-striped table-bordered table-hover">
			<thead>
				<tr>
					<th>用户账号</th>
					<th>用户类型</th>
					<th>用户余额</th>
					<th>投注总计</th>
					<th>派奖总计</th>
					<th>充值总计</th>
					<th>提款总计</th>
					<th>人工加款</th>
					<th>人工扣款</th>
					<th>转盘总计</th>
					<th>红包总计</th>
					<th>签到总计</th>
					<th>返点总计</th>
					<th>反水总计</th>
					<th>充值赠送</th>
					<th>注册赠送</th>
					<th>运营亏盈</th>
				</tr>
			</thead>
			<tbody>
			</tbody>
			<tfoot>
				<tr>
					<td><b>小计</b></td>
					<td id=""></td>
					<td id="sum-type1"></td>
					<td id="sum-type2"></td>
					<td id="sum-type3"></td>
					<td id="sum-type4"></td>
					<td id="sum-type5"></td>
					<td id="sum-type6"></td>
					<td id="sum-type7"></td>
					<td id="sum-type8"></td>
					<td id="sum-type9"></td>
					<td id="sum-type10"></td>
					<td id="sum-type11"></td>
					<td id="sum-type12"></td>
					<td id="sum-type13"></td>
					<td id="sum-type14"></td>
					<td id="sum-type15"></td>
				</tr>
				<tr>
					<td><b>总计</b></td>
					<td id=""></td>
					<td id="sum-type-he1" data-name="balance"></td>
					<td id="sum-type-he2" data-name="touzhu"></td>
					<td id="sum-type-he3" data-name="paijiang"></td>
					<td id="sum-type-he4" data-name="zxchongzhi"></td>
					<td id="sum-type-he5" data-name="zxtikuan"></td>
					<td id="sum-type-he6" data-name="rgjiakuan"></td>
					<td id="sum-type-he7" data-name="rgkoukuan"></td>
					<td id="sum-type-he8" data-name="xyzhuanpan"></td>
					<td id="sum-type-he9" data-name="hblingqu"></td>
					<td id="sum-type-he10" data-name="mrqiandao"></td>
					<td id="sum-type-he11" data-name="dlfandian"></td>
					<td id="sum-type-he12" data-name="mrfanshui"></td>
					<td id="sum-type-he13" data-name="czzengsong"></td>
					<td id="sum-type-he14" data-name="zczengsong"></td>
					<td id="sum-type-he15" data-name="kuiyin"></td>
				</tr>
			</tfoot>
		</table>
		<p style="color: red;">备注：盈亏是针对平台计算的，负数代表平台亏钱;</p>
		<p style="margin-left: 42px; color: red;">运营亏盈 ＝ 有效投注 － 彩票派奖－代理返点－日常反水－玩法反水－日常签到－幸运转盘－平台赠送－活动中奖 ;</p>
		<p style="margin-left: 42px; color: blue;">统计比较消耗系统性能，统计结果将缓存1分钟;</p>
	</div>

	<script>
	layui.use('laydate', function() {
		var laydate = layui.laydate;
		laydate.render({
			elem : '#date1',
			 value:new Date(),
		    max: new Date()+1
		});
		laydate.render({
			elem : '#date2',
			 value:new Date(),
		    max: new Date()+1
		});
	});
	
	function  dataTable01(){
			$("#table_id_example").DataTable({
		      // "bPaginate": true,
		      "bLengthChange": true,      
		      "bSort": false,
		      // "bInfo": true,
		      "bAutoWidth": false,
//		         "bServerSide":true,
		      'aLengthMenu':[5, 10, 20],
		       "searching": true, 
		       "dom": "t<'tableinfo'i<'tableSearch'p>l>",
//		    "searching": true,l
		       "language": {//语言设置  
		            "lengthMenu": "每页显示 _MENU_ 条记录",     
		            "zeroRecords": "没有检索到数据",     
		            "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",     
		            "info": "没有数据",     
		            "oPaginate": {     
		                "sFirst": "首页",     
		                "sPrevious": "前一页",     
		                "sNext": "后一页",     
		                "sLast": "尾页"    
		          	},
		            "search":"",
		            "searchPlaceholder": "请输入关键字",
		            "infoFiltered":   "(从  _MAX_ 记录中搜索出结果)",
		            "infoEmpty":      "没有找到匹配的信息",
		         },
		         "columns": [
		                     { "data": "name" },
		                     { "data": "user_type" },
		                     { "data": "balance",className:"balance-item-td" },
		                     { "data": "touzhu", className:"touzhu-item-td"},
		                     { "data": "paijiang", className:"paijiang-item-td"},
		                     { "data": "zxchongzhi" , className:"zxchongzhi-item-td"},
		                     { "data": "zxtikuan", className:"zxtikuan-item-td" },
		                     { "data": "rgjiakuan" , className:"rgjiakuan-item-td"},
		                     { "data": "rgkoukuan" , className:"rgkoukuan-item-td"},
		                     { "data": "xyzhuanpan" , className:"xyzhuanpan-item-td"},
		                     { "data": "hblingqu" , className:"hblingqu-item-td"},
		                     { "data": "mrqiandao" , className:"mrqiandao-item-td"},
		                     { "data": "dlfandian" , className:"dlfandian-item-td"},
		                     { "data": "mrfanshui" , className:"mrfanshui-item-td"},
		                     { "data": "czzengsong" , className:"czzengsong-item-td"},
		                     { "data": "zczengsong" , className:"zczengsong-item-td"},
		                     { "data": "kuiyin" , className:"kuiyin-item-td"}
		                 ],	 
			      "ajax": {
		    	  	  "type": 'post',
		    	      "url":"/bbgl/operateRecord.do", 
			    	  "data": function ( d ) {
			    	        d.startTime = $('#date1').val();
			    	        d.endTime = $('#date2').val();
			    	        d.userName = $('#obj-name').val();
			    	    }
			      },
 		          "drawCallback": function( settings ) {
 		        	  for (var i = 1; i < 16; i++) {
 		        		  var $item = $("#sum-type" + i)
 		        		  var className = $item.attr('class')
 		        		  var allDataTrs = $("tbody ." + className)
 		        		  var result = 0;
 		        		  for (var j = 0; j < allDataTrs.length; j++) {
 		        			  var item = allDataTrs[j]
 		        			  result += parseFloat($(item).text())
 		        		  }
 		        		 $item.text(result.toFixed(2))
 		        	  }
 		        	 var allData = $("#table_id_example").DataTable().data()
 		        	   for (var i = 1; i < 16; i++) {
 		        		  var $item = $("#sum-type-he" + i)
 		        		  var className = $item.attr('data-name')
 		        		   var result = 0
 		        		   for (var j = 0;j < allData.length; j++) {
 		        			   var dataItem = allData[j]
 		        			  result += dataItem[className]
 		        		   }
 		        		 $item.text(result.toFixed(2))
 		        	  }        
 		          }
		})
	}
		 dataTable01();
		insertSearchBtn();
			
			$("#btn-searchTable").on("click", function(e) {
				var table = $("#table_id_example").DataTable()		
				table.ajax.reload()
			})	
			$("#btn-resetTable").on("click", function(e) {
				$('#obj-name').val("");
				$('#date1').val("");
				$('#date2').val("");
				var table = $("#table_id_example").DataTable()		
				table.ajax.reload()
			})	
</script>
</body>
</html>